<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="path" value="${pageContext.request.contextPath}" />

<!DOCTYPE html>
<html>
<head>
<base href="${path}/pages/">
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<title>个人博客后台管理</title>
<link rel="stylesheet" href="../layui/css/layui.css">
</head>
<body>

	<div class="layui-fluid">
		<div class="layui-form" style="margin-top: 10px">
			<input type="hidden" name="friend_link_id" value="${friends_links.friend_link_id}">
			<div class="layui-form-item">
				<label class="layui-form-label">友链名称</label>
				<div class="layui-input-block">
					<input type="text" name="friend_link_name"
						value="${friends_links.friend_link_name}" lay-verify="required"
						placeholder="请输入名称" autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">友链链接</label>
				<div class="layui-input-block">
					<input type="text" name="friend_links"
						value="${friends_links.friend_links}" lay-verify="required"
						autocomplete="off" class="layui-input">
				</div>
			</div>

			<div class="layui-form-item">
				<div class="layui-tab">
					<ul class="layui-tab-title">
						<li class="layui-this">上传LOGO</li>
						<li>网络链接LOGO</li>

					</ul>
					<div class="layui-tab-content">
						<div class="layui-tab-item layui-show"><div class="layui-input-block">
					<button type="button" class="layui-btn" id="imgbtn">
						<i class="layui-icon">&#xe67c;</i> 上传LOGO图片
					</button>
					<input type="hidden" name="friend_link_logo" value="${friends_links.friend_link_logo}">
					
					<span id="imgpath" style="margin-left: 20px;"> </span>
						</div>
					</div>
						<div class="layui-tab-item"><div class="layui-input-block">
					<input type="text" name="friend_linksw" value="${friends_links.friend_link_logo}"placeholder="请输入链接" autocomplete="off" class="layui-input">
				</div></div>
					</div>
				</div>
				
			</div>

			<div class="layui-collapse">
				<div class="layui-colla-item">
					<h2 class="layui-colla-title">友链描述（选填）</h2>
					<div class="layui-colla-content">
						<div class="layui-form-item layui-form-text">
							<div class="layui-input-block">
								<textarea name="friend_link_logo" class="layui-textarea">${article.article_content}</textarea>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="layui-form-item layui-hide">
				<input type="button" lay-submit lay-filter="lay-form-submit"
					id="lay-form-submit">
			</div>
		</div>

		<script src="${path }/layui/layui.js"></script>
		<script>
			layui.use([ 'form', 'upload', 'element' ], function() {
				var form = layui.form;
				var $ = layui.$;
				var upload = layui.upload;
				var element = layui.element;

				//文件上传
				upload.render({
					elem: '#imgbtn',
					url: '${path}/upload',
					acceptMime:'image/*',
					data:{
						imgType:'friends_links',
						imgId:'${friends_links.friend_link_id}'
					},
					done: function(resp) {
						if(resp.success) {
							var li='';
							$('#titlePic').val(resp.data.src);
							li+='<input type="hidden" name="friend_link_logo" value="'+resp.data.src+'">'
							li+='<input type="hidden" name="imgid" value="'+resp.data.img_id+'">';
							li+='<a target="_blank" href="${path}'+resp.data.src+'">'+resp.data.title+'</a>';
							$('#imgpath').html(li);
						}
						layer.msg(resp.msg);
					}			
				});

				//监听提交
				form.on('submit(lay-form-submit)', function(data) {

				var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引  
					//提交ajax成功后，关闭当前弹层并重载表格
					$.post('${path}/action/links/save', data.field, function(
							json) {
						parent.layui.table.reload('lay-table'); //重载表格
						parent.layer.close(index); //再执行关闭      				
					}, 'JSON');
				});
				
		</script>
	</div>

</body>
</html>
